<template>
  <div class="recommended">
    <div>
        <img :src="obj.pic" alt="">
    </div>
    <p>{{obj.title}}</p>
    <p class="gray">{{obj.descript}}</p>
 </div>
</template>

<script>
export default {
  name: 'recommended',
  props:{
      obj:{
          type:Object,
          required:true
      }
  },
  data() { 
    return {

    }
  },
  created() {

  },
  methods:{

  },
 }
</script>

<style lang="scss" scoped>
.recommended{
    width: 85%;
    height: 100%;
    // margin-left: 0.2rem;
    padding: 0 0.2rem;
    div{
        width: 100%;
        height: 70%;
    
        img{
            width: 100%;
            height: 100%;
            border-radius: 0.1rem;
        }
    }
    p{
        font-size: 0.24rem;
        width: 100%;
        margin-top: 0.3rem;
        overflow: hidden;
        text-overflow:ellipsis;
        white-space: nowrap;
    }
}
.gray{
    color: gray;
}
</style>